<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0;" />
		<title>websocket+python测试</title>
		<style>
			*{margin: 0px;padding: 0px;}
			body{overflow: hidden;}
			.container{position: absolute;top:0px;left:0px;width: 100%;height: 100%;}
			.m-board{width: 96%;height: 80%;margin: 5px 2% 5px 2%;border: 1px solid blue;}
			.m-board textarea{width: 100%;height: 100%;border: 0px;border-radius: 0px;}
			.m-box{width: 96%;height: 10%;margin: 0px 2% 5% 2%;border: 1px solid blue;}
			.m-box input{width: 100%;height: 100%;border: 0px;border-radius: 0px;font-size: 16px;}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="m-board">
				<textarea id="text"readonly="readonly"></textarea>
			</div>
			<div class="m-box">
				<input type="text" id="message" />
			</div>
		</div>
	</body>
</html>
<script>
	document.addEventListener("touchmove",function(e){e.preventDefault();},false);
	var mBox = document.getElementById("text");
	var mMsg = document.getElementById("message");
	mMsg.addEventListener("keydown",function(e){
		if(e.keyCode == 13){
			if(mMsg.value != "")socket.send(mMsg.value);
			mMsg.value = "";
		}
	},false);
	function show(msg){mBox.textContent += msg + "\n";}
	(function(){
		show("服务器连接中......");
		if(navigator.userAgent.indexOf("Windows") >= 0)socket = new WebSocket("ws://127.0.0.1:9527/cgi-bin/pycgi.py");
		else socket = new WebSocket("ws://192.168.191.1:9527/cgi-bin/pycgi.py");
		socket.onopen = function(e){show("服务器连接成功!:)");}
		socket.onmessage = function(e){show(e.data);}
		socket.onerror = function(e){show("天啦撸,夭寿啦~");}
		socket.onclose = function(e){show("与服务器的连接关闭了:(");}
	})();
</script>
